<template>
  <div>
    <a-tree
      :disabled="disabled"
      checkable
      v-model="checkedKeys"
      :show-icon="true"
      :tree-data="dataList"
      :replaceFields="replaceFields"
      :selectedKeys="treeSelectedKeys"
      :blockNode="true"
      @check="onSelect"
      style="max-height: 350px; overflow-y: auto"
    />
  </div>
</template>

<script>
import { findCompanyGroupReq, childCompanyName } from "./api";
export default {
  props: {
    hasLeftIcon: {
      // 是否有左边图标
      type: Boolean,
      default: true
    },
    hasRightIcon: {
      // 是否有右边图标
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      disabled: false,
      checkedKeys: [],
      // 已选择的分组或者用工单位
      selectTreeId: "-1",
      // 树结构
      replaceFields: {
        children: "companyList",
        title: "name",
        key: "id",
        value: "id"
      },
      // popover显示状态
      clicked: false,
      // 树数据
      dataList: [],
      // 选择的key
      treeSelectedKeys: ["-1"],
      // 选择的id
      siteId: undefined,
      // 选择的name
      siteName: undefined,
      // 公司name
      treeSiteName: undefined,
      isAllChildCompany: false,
      childCompanyIdList: [],
      employerIdList: [],
      copyList: [],
      copyList2: []
    };
  },
  created() {
    // 获取缓存的数据
    this.selectTreeId = sessionStorage.getItem("selectTreeId") ? sessionStorage.getItem("selectTreeId") : "-1";
    this.treeSelectedKeys = [`${sessionStorage.getItem("selectTreeId") ? sessionStorage.getItem("selectTreeId") : "-1"}`];
    this.siteName = sessionStorage.getItem("siteName");
    this.siteId = sessionStorage.getItem("siteId") == null ? undefined : sessionStorage.getItem("siteId");
    sessionStorage.clear();
    //  请求公司名
    // this.childCompanyName();
    // this.getByUserId();
    this.findCompanyGroup();
  },
  methods: {
    getDisabled(e) {
      this.disabled = e;
    },
    getId(e) {
      if (e.isAllChildCompany === true) {
        setTimeout(() => {
          this.checkedKeys = ["-1"];
          this.isAllChildCompany = true;
          this.employerIdList = [];
          this.childCompanyIdList = [];
          this.$emit("update:isAllChildCompany", this.isAllChildCompany);
          this.$emit("update:childCompanyIdList", this.childCompanyIdList);
          this.$emit("update:employerIdList", this.employerIdList);
        }, 100);
      } else {
        this.isAllChildCompany = false;
        this.employerIdList = e.companyIds;
        this.childCompanyIdList = e.groupIds;
        this.checkedKeys = e.companyIds.concat(e.groupIds);
        this.$emit("update:isAllChildCompany", this.isAllChildCompany);
        this.$emit("update:childCompanyIdList", this.childCompanyIdList);
        this.$emit("update:employerIdList", this.employerIdList);
      }
    },
    // popover显示方法
    handleClickChange(visible) {
      this.clicked = visible;
    },
    // 选择树点击事件
    onSelect(selectedKeys, info) {
      console.log(this.treeSelectedKeys, this.checkedKeys);
      if (!info.node.checked && info.node.dataRef.id === "-1") {
        this.isAllChildCompany = true;
        this.employerIdList = [];
        this.childCompanyIdList = [];
        this.dataList.forEach((item, index) => {
          if (item.type === "site") {
            item.companyList.forEach((item2, index2) => {
              this.copyList.push(item2.id);
              item2.companyList.forEach((item3, index3) => {
                this.copyList2.push(item3.id);
              });
            });
          } else if (item.type === "group") {
            this.copyList.push(item.id);
            item.companyList.forEach((item2, index2) => {
              this.copyList2.push(item2.id);
            });
          } else if (item.type === "company") {
            this.copyList = [];
            this.copyList2.push(item.id);
          }
        });
      }
      if (info.node.checked && info.node.dataRef.id === "-1") {
        this.isAllChildCompany = false;
        //  this.copyList=[]
      }
      if (!info.node.checked && info.node.dataRef.type === "group") {
        this.childCompanyIdList.push(info.node.dataRef.id);
        this.copyList.push(info.node.dataRef.id);
        this.isAllChildCompany = false;
      }
      if (info.node.checked && info.node.dataRef.type === "group") {
        if (this.isAllChildCompany === true) {
          this.childCompanyIdList = this.copyList;
        }
        this.childCompanyIdList.forEach((item, index) => {
          if (item === info.node.dataRef.id) {
            this.childCompanyIdList.splice(index, 1);
          }
        });
        this.isAllChildCompany = false;
      }
      if (!info.node.checked && info.node.dataRef.type === "company") {
        this.isAllChildCompany = false;
        this.employerIdList.push(info.node.dataRef.id);
      }
      if (info.node.checked && info.node.dataRef.type === "company") {
        if (this.isAllChildCompany === true) {
          this.employerIdList = this.copyList2;
        }
        this.isAllChildCompany = false;
        this.employerIdList.forEach((item, index) => {
          if (item === info.node.dataRef.id) {
            this.employerIdList.splice(index, 1);
          }
        });
      }
      this.$emit("update:siteIds", this.siteId);
      this.$emit("update:siteName", this.siteName);
      this.$emit("update:selectTreeId", this.selectTreeId);
      this.$emit("update:type", info.node.dataRef.type);

      this.$emit("update:isAllChildCompany", this.isAllChildCompany);
      this.$emit("update:childCompanyIdList", this.childCompanyIdList);
      this.$emit("update:employerIdList", this.employerIdList);
    },
    // 搜索按钮
    onChange(e) {
      const value = e.target.value;
      // 根据搜索条件筛选
      this.findCompanyGroup(value);
    },
    // 查询所有组和用工单位
    findCompanyGroup(value) {
      const data1 = {
        name: value || undefined
      };
      findCompanyGroupReq(data1)
        .then((res) => {
          console.log("debug log --> ", res);
          this.dataList = this.addTreeSlot(res.data);
          this.dataList.forEach((item, index) => {
            if (item.type === "site") {
              item.id = "-1";
            }
          });
          this.dataList.forEach((item, index) => {
            if (item.type === "site") {
              item.companyList.forEach((item2, index2) => {
                this.copyList.push(item2.id);
              });
            } else if (item.type === "group") {
              this.copyList.push(item.id);
              // item.companyList.forEach((item2, index2) => {
              //   this.copyList2.push(item2.id);
              // });
            } else if (item.type === "company") {
              this.copyList = [];
              this.copyList2.push(item.id);
            }
          });
          // const dataListTemporary = [
          //   {
          //     name: this.treeSiteName ? this.treeSiteName : this.siteName,
          //     id: "-1",
          //     companyList: this.dataList,
          //     scopedSlots: { title: "custom" }
          //   }
          // ];
          // this.dataList = [...dataListTemporary];
        })
        .catch((err) => {
          console.log("debug log --> ", err);
        });
    },
    // treeData添加字段
    addTreeSlot(data) {
      if (!data) {
        return [];
      }
      data.forEach((el) => {
        el.scopedSlots = { title: "custom" };
        this.addTreeSlot(el.companyList);
      });
      return data;
    },
    // 查询公司名
    childCompanyName() {
      childCompanyName()
        .then((res) => {
          console.log("debug log --> ", res);
          this.siteName = this.siteName ? this.siteName : res.data;
          sessionStorage.setItem("siteName", this.siteName);
          this.treeSiteName = res.data;
          this.findCompanyGroup();
        })
        .catch((err) => {
          console.log("debug log --> ", err);
        });
    }
  }
};
</script>

<style lang="scss">
.select-company-wrapper {
  .iconfont {
    color: var(--primary);
  }
  .font-title {
    font-size: 16px;
    font-weight: 500;
    color: #55565d;
    line-height: 24px;
  }
}
</style>
